import { DarkTheme, DefaultTheme, ThemeProvider } from '@react-navigation/native';
import { useFonts } from 'expo-font';
import { Stack } from 'expo-router';
import * as SplashScreen from 'expo-splash-screen';
import { StatusBar } from 'expo-status-bar';
import { useEffect } from 'react';
import 'react-native-reanimated';
import * as eva from '@eva-design/eva';
import { ApplicationProvider, Layout, Text, IconRegistry } from '@ui-kitten/components';
import { useColorScheme } from '@/hooks/useColorScheme';
import { EvaIconsPack } from '@ui-kitten/eva-icons';
import { SafeAreaProvider, useSafeAreaInsets  } from 'react-native-safe-area-context';

import {
  StyleSheet,
  PixelRatio,
  Dimensions,
  Platform,
  SafeAreaView
} from 'react-native'
// Prevent the splash screen from auto-hiding before asset loading is complete.
SplashScreen.preventAutoHideAsync();

export default function RootLayout() {
  const colorScheme = useColorScheme();
  const [loaded] = useFonts({
    SpaceMono: require('../assets/fonts/SpaceMono-Regular.ttf'),
  });

  useEffect(() => {
    if (loaded) {
      SplashScreen.hideAsync();
    }
  }, [loaded]);

  if (!loaded) {
    return null;
  }
  const insets = useSafeAreaInsets();

  return (
    <>
      <IconRegistry icons={EvaIconsPack} />
      <ApplicationProvider {...eva} theme={eva.light}>
        <SafeAreaProvider style={{ flex: 1, paddingTop: insets.top }}>
          <Layout style={{ backgroundColor: '#fff', flex: 1 }}>
            <Stack screenOptions={{ headerShown: false, contentStyle: { backgroundColor: '#fff', } }}>
              <Stack.Screen name="index" />
              <Stack.Screen name="email" />
              <Stack.Screen name="chooseIdentity" />
              <Stack.Screen name="(tabs)" />
              <Stack.Screen name="+not-found" />
            </Stack>
          </Layout>
        </SafeAreaProvider>
      </ApplicationProvider>
    </>
  );
}


const styles = StyleSheet.create({
  ios: {}
});